<template>
    <div class="xxx">
        <!-- 轮播图 -->
        <div class="slide">
            <div class="layui-carousel" id="index1">
                <div carousel-item>
                    <div>
                        <div class="image" style="background-image:url('./static/images/slide/1.jpg');"></div>
                    </div>
                    <div>
                        <div class="image" style="background-image:url('./static/images/slide/2.jpg');"></div>
                    </div>
                    <div>
                        <div class="image" style="background-image:url('./static/images/slide/3.jpg');"></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 客户类型 -->
        <div class="custom-type padding-wrap">
            <div class="group pure-g">
                <div class="box pure-u-1-1 pure-u-lg-1-2 pure-u-md-1-2 pure-u-sm-1-1">
                    <div class="image" style="background-image:url('./static/images/custom-type-1.jpg');"></div>
                    <div class="infos">
                        <div class="title">金融客户</div>
                        <div class="sub-title">金融企业科技产品，解决大数据及云服务</div>
                    </div>
                </div>
                <div class="box pure-u-1-1 pure-u-lg-1-2 pure-u-md-1-2 pure-u-sm-1-1">
                    <div class="image" style="background-image:url('./static/images/custom-type-2.jpg');"></div>
                    <div class="infos">
                        <div class="title">政府&企业客户</div>
                        <div class="sub-title">政府&企业网络解决方案、产品及服务</div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 新闻动态 -->
        <div class="news-dynamic padding-wrap">
            <!-- 通用标题 -->
            <components-common-title title="新闻动态" sub-title="实时报道企业动态,深入了解天云"></components-common-title>
            <!-- 新闻图文内容 -->
            <div class="pure-g">
                <div class="left-box pure-u-1-1 pure-u-lg-1-2 pure-u-md-1-2 pure-u-sm-1-1" style="background-image:url('./static/images/custom-left.jpg')">
                    <div class="date">
                        <div class="day">12</div>
                        <div class="year-month">2020-03</div>
                    </div>
                    <div class="info">
                        名校到访英国邓迪大学代表团走进天云软件交流考察
                    </div>
                </div>
                <div class="right-box pure-u-1-1 pure-u-lg-1-2 pure-u-md-1-2 pure-u-sm-1-1">
                    <div class="list">
                        <div class="date">
                            <div class="day">12</div>
                            <div class="year-month">2019-09</div>
                        </div>
                        <div class="text">
                            <div class="title">中标快讯天云软件助力招商银行打造零售银行数据</div>
                            <div class="summary">天云软件中标招商银行,该项目将帮助招行长沙分行打造零售银行数据中台让非科技部门懂数据,会用数据,通过数据赋能银行新零售业务</div>
                        </div>
                    </div>
                    <div class="list">
                        <div class="date">
                            <div class="day">12</div>
                            <div class="year-month">2019-09</div>
                        </div>
                        <div class="text">
                            <div class="title">中标快讯天云软件助力招商银行打造零售银行数据</div>
                            <div class="summary">天云软件中标招商银行,该项目将帮助招行长沙分行打造零售银行数据中台让非科技部门懂数据,会用数据,通过数据赋能银行新零售业务</div>
                        </div>
                    </div>
                    <div class="list">
                        <div class="date">
                            <div class="day">12</div>
                            <div class="year-month">2019-09</div>
                        </div>
                        <div class="text">
                            <div class="title">中标快讯天云软件助力招商银行打造零售银行数据</div>
                            <div class="summary">天云软件中标招商银行,该项目将帮助招行长沙分行打造零售银行数据中台让非科技部门懂数据,会用数据,通过数据赋能银行新零售业务</div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 了解更多 -->
            <components-more-button text="了解更多"></components-more-button>
        </div>
        <!-- 合作客户 -->
        <div class="cooperative-client padding-wrap">
            <!-- 通用标题 -->
            <components-common-title title="合作客户" sub-title="多家知名企业信任,诚信合作共赢"></components-common-title>
            <!-- 新闻图文内容 -->
            <div class="pure-g">
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/1.png');"></div>
                        <div class="text">中国银行</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/2.png');"></div>
                        <div class="text">中国建设银行</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/3.png');"></div>
                        <div class="text">湖南省农村信用社</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/4.png');"></div>
                        <div class="text">方正证券</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/5.png');"></div>
                        <div class="text">华融湘江银行</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/1.png');"></div>
                        <div class="text">中国银行</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/2.png');"></div>
                        <div class="text">中国建设银行</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/3.png');"></div>
                        <div class="text">湖南省农村信用社</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/4.png');"></div>
                        <div class="text">方正证券</div>
                    </div>
                </div>
                <div class="box pure-u-1-3 pure-u-lg-1-5 pure-u-md-1-3 pure-u-sm-1-2">
                    <div class="media">
                        <div class="image" style="background-image:url('./static/images/cooperative-client/5.png');"></div>
                        <div class="text">华融湘江银行</div>
                    </div>
                </div>
            </div>
            <!-- 了解更多 -->
            <components-more-button></components-more-button>
        </div>
    </div>
</template>
